05. Alignment and Line-Height

If you recall back from [earlier in this lesson]

Alignment and Line-Height

If you recall back from earlier in this lesson, you learned that inline elements create line boxes. If an inline element exceeds the space available inside its container, it will create multiple lines boxes.

wrapping-inline-box

Inline element: But what happens when the content is wider than the space available?

Inline element: But what happens when the content is wider than the space available?

You also learned that inline eleme

You also learned that inline elements, and line boxes, have some interesting quirks. For example, you cannot set the height or width of an inline element, which means you cannot set the height or width of a line box either. Another quirk is when an inline element creates multiple line boxes, left/right border and margin are added at the beginning of the first line box and end of the last line box.

margin and border quirks

Margin and border quirks with inline elements

Margin and border quirks with inline elements

So with that said, what other proper

So with that said, what other properties can you use to manipulate line boxes?

For the next three quizzes, you'll be experimenting with the three new properties that control the horizontal and vertical alignment of line boxes, as well as their height: text-align , vertical-align , and line-height.

When you're ready to get started, click "Next".